@import '~@/assets/less/common.less';

.operation-button {
  font-size: 36px;
  border-radius: 30px;
  box-shadow: 0px 8px 0px rgba(0,0,0,.2);
}

.operation-button:active {
  box-shadow: 0px 5px 0px rgba(0,0,0,.2);
  top: 1px;
}

.hall {
  background: url('~@/assets/img/hall/bg.png') no-repeat;
  background-size: 100%;
  width: 100%;
  height: 100%;

  .box {
    width: 100%;
    height: 100%;
    display: flex;
    .left, .right {
      flex: 1;
    }
  
    .left {
      padding: 30px 30px 30px 30px;
      .fast-join {
        width: 100%;
        height: 100%;
      }
    }

    .right {
      padding: 30px 30px 30px 0;
      display: flex;
      flex-direction: column;
      .join-room, .create-room {
        flex: 1;
      }
      .join-room {
        margin-bottom: 20px;
      }
    }
  }
}